<!DOCTYPE html>
<html>
<include file="Public:header" />
<link href="__ACSS__/dialog.css" rel="stylesheet">
<link href="__ACSS__/plugins/validform/validform.css" rel="stylesheet">
<style>
	.form-control{ padding-left:5px;}
	.upload-warp{ position:relative;}
	.upload-btn{ position:absolute; top:0; right:0; border-radius:0;}
	
	.file-preview {border:1px solid #ddd; padding:5px; width:100%; margin-bottom:5px;}
	.file-preview-frame{ margin:8px; border:1px solid #ddd; box-shadow:1px 1px 5px 0px #a2958a; padding:6px; float:left; text-align:center; vertical-align:middle;}
	.file-preview-frame .btn{ float:right; margin-top:5px;}
	.file-preview-text{ color:#428bca; font-size:11px; text-align:center;}
	#mapContainer{width:100%; height:400px;}
	.clockpicker{ width:46%; float:left;}
	.clockpicker-addon{ width:8%; height:34px; line-height:34px; text-align:center; float:left;}
	.purchase-box{ width:90%;}
	.purchase-box span{ border:1px solid #ddd; padding:3px 10px; border-radius:4px; float:left; background:#fff; font-size:15px; position:relative; cursor:pointer; margin:0 10px 10px 0;}
	.purchase-box span i{ margin-left:8px; color:#888;}
	.purchase-box span:hover{ border:1px solid #999; background:#eee;}
</style>
  <body>
	  <div class="wrapper wrapper-content animated fadeInRight">
	  	<div role="alert" class="alert alert-info" style="line-height:24px;"><strong><font style="color:red">活动会场</font> 和 <font style="color:red">特价疯抢 </font>只能存在一条数据。</strong></div>
	  	<form role="form" class="form" action="__URL__/insert">
			<input type="hidden" name="flag" value="1">
			<input type="hidden" name="create_time" value="<php>echo time();</php>">
			<div class="form-group">
				<label class="col-sm-2 control-label">类型：</label>
				<div class="col-sm-10">
					<select class="form-control" name="type" datatype="*">
						<foreach name="typeList" item="typeList">
							<option value="<{$typeList.value}>"><{$typeList.text}></option>
						</foreach>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">会场标题：</label>
				<div class="col-sm-10">
					<input type="text" datatype="*" name="title" class="form-control" placeholder="会场标题">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">网页会场图：</label>
				<div class="col-sm-10">
					<div class="file-preview" style="display:none;">
					    <div class="file-preview-thumbnails" data-num="1">
							
						</div>
					    <div class="clearfix"></div>
					</div>
					<div class="upload-warp">
	                	<input class="form-control localname" type="text" placeholder="尺寸为150px*1200px 100kb左右" datatype="*" nullmsg="请上传图片" errormsg="请上传图片" readonly="readonly">
	                	<button type="button" onclick="uploadPhoto(this)" class="btn btn-primary upload-btn"><i class="glyphicon glyphicon-folder-open"></i>&nbsp;&nbsp;选择&nbsp;...</button>
	               		<input type="hidden" name="img_web" class="head_picture"/>
               		</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">手机会场图：</label>
				<div class="col-sm-10">
					<div class="file-preview" style="display:none;">
					    <div class="file-preview-thumbnails" data-num="1">
							
						</div>
					    <div class="clearfix"></div>
					</div>
					<div class="upload-warp">
	                	<input class="form-control localname" type="text" placeholder="尺寸为300px*750px 50kb左右" datatype="*" nullmsg="请上传图片" errormsg="请上传图片" readonly="readonly">
	                	<button type="button" onclick="uploadPhoto(this)" class="btn btn-primary upload-btn"><i class="glyphicon glyphicon-folder-open"></i>&nbsp;&nbsp;选择&nbsp;...</button>
	               		<input type="hidden" name="img_app" class="head_picture"/>
               		</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">会场描述：</label>
				<div class="col-sm-10">
					<textarea datatype="*" name="desc" class="form-control" placeholder="会场描述"></textarea>
				</div>
			</div>
			<div class="clearfix">
				<button type="submit" id="submit" class="btn btn-success btn-block">提交</button>
				<button type="reset" id="reset2" class="btn btn-success btn-block hidden">重置</button>
			</div>
		</form>
	  </div>
  </body>
<!-- 全局js -->
<include file="Public:foot" />
<script src="__AJSPLUGINS__/validform/Validform_v5.3.2_min.js"></script>
<!-- Uploader -->
<script type="text/javascript" src="__AJS__/jquery.upload.js"></script>
<script>
//上传图
function uploadPhoto(t){
	var arr = new Object();
	arr['t'] = t;
	arr['folderName'] = 'Meetingplace';
	arr['prefix'] = 'm_';
	doUpload(arr);
}

//上传图片
function doUpload(arr) {
	$.upload({
		url: '__URL__/uploadImg',
		fileName: 'filedata',
		dataType: 'json',
		acceptType:'image/jpeg,image/png',
		params:{maxWidth:arr['maxWidth'],maxHeight:arr['maxHeight'],folderName:arr['folderName'],prefix:arr['prefix']},
		onSend: function() {
			return true;
		},
		// 上传之后回调
		onComplate: function(data) {
			if(data.status == 1){
				var url = data.data.url;
				var localname = data.data.localname;
				if($(arr['t']).parents(".form-group").find(".file-preview-thumbnails").attr("data-num") == 1) {
					$(arr['t']).parents(".form-group").find(".file-preview-thumbnails").html('<div class="file-preview-frame"><span class="file-preview-image"><img style="width:150px;" class="file-preview-image" ref="'+ localname  +'" rel="'+ url  +'" src=__IMGROOT__'+ url +'></span><div class="clearfix"></div><button class="btn btn-xs btn-white" type="button" onclick="delPhoto(this)"><i class="glyphicon glyphicon-trash text-danger"></i></button></div>');
				}else if($(arr['t']).parents(".form-group").find(".file-preview-thumbnails").attr("data-num") > 1) {
					$(arr['t']).parents(".form-group").find(".file-preview-thumbnails").append('<div class="file-preview-frame"><span class="file-preview-image"><img style="width:150px;" class="file-preview-image" ref="'+ localname  +'" rel="'+ url  +'" src=__IMGROOT__'+ url +'></span><div class="clearfix"></div><button class="btn btn-xs btn-white" type="button" onclick="delPhoto(this)"><i class="glyphicon glyphicon-trash text-danger"></i></button></div>');
				}
				initPhoto();
			}else{
				layer.alert(data.info);
			}
		}
	});
}
//重新绘制图片尺寸
function resizeView() {
	/*
	if($(".file-preview-image").width() > $(".file-preview-thumbnails").width()) {
		$(".file-preview-image").width($(".file-preview-thumbnails").width());
	}else{
		$(".file-preview-image").width("100%");
	}
	*/
}

//删除图片
function delPhoto(t) {
	layer.confirm('确定执行？', function(index){
		$(t).parents(".file-preview-frame").remove();
		initPhoto();
	    layer.close(index);
	});
}

function initPhoto() {
	//上传张数上限操作
	$(".file-preview-thumbnails").each(function() {
		if($(this).attr("data-num") <= $(this).find(".file-preview-frame").length) {
			$(this).parents(".form-group").find(".upload-btn").attr("disabled","disabled");
		}else{
			$(this).parents(".form-group").find(".upload-btn").removeAttr("disabled");
		}
		if($(this).find(".file-preview-frame").length == 0) {
			$(this).parents(".file-preview").hide();
		}else{
			$(this).parents(".file-preview").show();
		}
	})
	//初始化图片相应表单属性
	$(".file-preview-thumbnails").each(function() {
		var localname = "";
		var url = "";
		$(this).find("img").each(function(index) {
			if(index == 0) {
				url += $(this).attr("rel");
				localname += $(this).attr("ref");
			}else{
				url += "|" + $(this).attr("rel");
				localname += "|" + $(this).attr("ref");
			}
		})
		$(this).parents(".form-group").find(".localname").val(localname);
		$(this).parents(".form-group").find(".head_picture").val(url);
	})
}
$(function(){
	$("#reset2").click();
	var index = parent.layer.getFrameIndex(window.name);
	var form = $(".form").Validform({
		tiptype:4,
		ajaxPost:true,
		callback:function(data){
			if(data.status == 1) {
				window.parent.layer.msg(data.info);
				window.parent.$('#table_list').trigger("reloadGrid");
			}else{
				window.parent.layer.msg(data.info);
			}
			parent.layer.close(index);
		}
	});
})
</script>
</html>